/*
 * @Description: 列表组件（包含线路、车站、高德位置）
 * @Author: buwei.huang
 * @Date: 2019-06-17 15:18:32
 * @Last Modified by: buwei.huang
 * @Last Modified time: 2019-06-17 15:19:05
 */
<template>
  <scroll
    class="search_list"
    ref="scroll"
    :class="show == '3'? 'scrollHeight' : ''"
    :useBody="useBody"
    :getListData="getListDataByScroll"
    :up="up"
  >
    <!-- 线路列表 -->
    <search-list-item
      :listData="busInfo.busList"
      :type="1"
      :more="busInfo.busNobutton"
      v-if="busInfo.busList && busInfo.busList.length > 0"
    />
    <!-- 车站列表 -->
    <search-list-item
      :listData="busInfo.stationList"
      :type="2"
      :more="busInfo.stationNobutton"
      v-if="busInfo.stationList && busInfo.stationList.length > 0"
    />
    <!-- 高德获取位置 -->
    <search-list-item
      :GPSinfo="GPSinfo"
      :listData="busInfo.amapList"
      :type="3"
      :more="busInfo.amapNobutton"
      v-if="busInfo.amapList && busInfo.amapList.length > 0"
    />
    <search-list-item
      :GPSinfo="GPSinfo"
      :listData="busInfo.historyList"
      @clearHistory="clearHistory"
      :type="0"
      v-if="busInfo.historyList && busInfo.historyList.length > 0"
    />
  </scroll>
</template>
<script>
import SearchListItem from './SearchListItem'
import scroll from './scroll'
import { getBusRouterStationInfo } from '../api/api'
import { getUrlParams } from 'vue-xiaobu-utils'
import { getStorage } from '../utils/Storage.js'

export default {
  components: {
    'search-list-item': SearchListItem,
    scroll
  },
  props: {
    show: {
      type: String,
      default: '1'
    },
    GPSinfo: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      busInfo: {
        // 数据总数 -- 是否需要分页
        busCount: 0,
        stationCount: 0,
        amapCount: 0,
        // 数据
        busList: [],
        stationList: [],
        amapList: [],
        historyList: [],
        // 是否显示更多
        busNobutton: false,
        stationNobutton: false,
        amapNobutton: false
      },
      // 是否使用body作为滑动容器
      useBody: false,
      up: {
        noMoreSize: this.type ? 16 : 6,
        page: { size: this.type ? 15 : 5 }
      }
    }
  },
  computed: {
    getSearchText() {
      return this.$store.getters.searchText
    }
  },
  watch: {
    getSearchText(val) {
      this.resetData()
      this.$refs.scroll.mescroll.resetUpScroll()
    }
  },
  beforeCreate() {
    // 获取url参数，判断是否是更多页面
    let params = getUrlParams()
    this.$store.dispatch('fetchSearchText', params.searchText)
    this.type = params.type
    console.log(params, 'params')
  },
  methods: {
    // 改变组件显示
    changeShow(msg) {
      this.$emit('changeShow', msg)
    },
    // scroll获取数据
    getListDataByScroll(pageIndex, pageSize) {
      let txt = this.getSearchText
      return this.getSearchText ? getBusRouterStationInfo(pageIndex, pageSize, this.getSearchText).then(res => {
        if (this.getSearchText !== txt) return { length: pageSize, count: 5 } // 避免被之前一次请求顶掉
        this.changeShow('3')
        // 根据url判断更多页面
        if (!this.type) {
          this.busInfo = res
          this.busInfo.busNobutton = res.busCount > 5
          this.busInfo.stationNobutton = res.stationCount > 3
          this.busInfo.stationList = this.busInfo.stationList.length > 3 ? this.busInfo.stationList.slice(0, 3) : this.busInfo.stationList
          this.busInfo.amapNobutton = res.amapCount > 5
          if (this.busInfo.busCount === 0 && this.busInfo.stationCount === 0 && this.busInfo.amapCount === 0) {
            this.changeShow('2')
          }
          return { length: pageSize, count: 5 }
        } else {
          this.busInfo.busCount = res.busCount
          this.busInfo.stationCount = res.stationCount
          this.busInfo.amapCount = res.amapCount
          switch (this.type) {
            case '1':
              this.busInfo.busList = pageIndex > 1 ? this.busInfo.busList.concat(res.busList) : res.busList
              this.busInfo.stationList = []
              this.busInfo.amapList = []
              this.judgeCount(this.busInfo.busCount)
              return { length: pageSize, count: this.busInfo.busCount }
            case '2':
              this.busInfo.stationList = pageIndex > 1 ? this.busInfo.stationList.concat(res.stationList) : res.stationList
              this.busInfo.busList = []
              this.busInfo.amapList = []
              this.judgeCount(this.busInfo.stationCount)
              return { length: pageSize, count: this.busInfo.stationCount }
            case '3':
              this.busInfo.amapList = pageIndex > 1 ? this.busInfo.amapList.concat(res.amapList) : res.amapList
              this.busInfo.stationList = []
              this.busInfo.busList = []
              this.judgeCount(this.busInfo.amapCount)
              return { length: pageSize, count: this.busInfo.amapCount }
            default: break
          }
        }
      }).catch(() => { }) : getStorage('searchData').then(res => {
        if (res && res.length > 0) {
          this.changeShow('3')
          this.busInfo.historyList = res
          return { length: pageSize, count: this.busInfo.historyList.length }
        } else {
          this.changeShow('1')
          return { length: pageSize, count: 5 }
        }
      })
    },
    // 数据重置
    resetData() {
      this.busInfo = {
        busCount: 0,
        stationCount: 0,
        amapCount: 0,
        busList: [],
        stationList: [],
        amapList: [],
        historyList: [],
        busNobutton: false,
        stationNobutton: false,
        amapNobutton: false
      }
    },
    // 清除历史
    clearHistory() {
      this.changeShow('1')
    },
    // 判断数组有无
    judgeCount(count) {
      if (count === 0) {
        this.changeShow('2')
      }
    }
  }
}
</script>

<style>
.search_list {
  height: 0;
}
.scrollHeight {
  /* height: calc(100% - 98px); */
  height: 100%;
}
</style>
